<template>
     <div class="avatar">
        <el-avatar shape="square" :size="200"
            :src="stuInfo.headimgurl" />
    </div>
    <el-descriptions title="学员资料" direction="vertical" :column="4" border>
        <el-descriptions-item label="sId" width="500px">{{stuInfo.sId}}</el-descriptions-item>
        <el-descriptions-item label="姓名" width="500px">{{stuInfo.name}}</el-descriptions-item>
        <el-descriptions-item label="年龄" :span="2" width="500px">{{stuInfo.age}}</el-descriptions-item>
        <el-descriptions-item label="班级">{{stuInfo.class}}</el-descriptions-item>
        <el-descriptions-item label="学历">{{stuInfo.degree}}</el-descriptions-item>
        <el-descriptions-item label="项目地址" :span="3">{{stuInfo.productUrl}}</el-descriptions-item>
        <el-descriptions-item label="描述">{{stuInfo.description}}</el-descriptions-item>
        <el-descriptions-item label="城市">{{stuInfo.city}}</el-descriptions-item>
        <el-descriptions-item label="创建时间" :span="4">{{stuInfo.cTime}}</el-descriptions-item>
    </el-descriptions>
</template>
<script setup>
//引入users的pinia
import {storeToRefs} from "pinia"
//引入store中的users.js，获取用户信息
import {useUser} from "@/store/users"
//使用store
let userStore =useUser()
// 解构store,从pinia中获取用户信息，展示
let {stuInfo} = storeToRefs(userStore)
// console.log(stuInfo);
// console.log(stuInfo.value);
// console.log(stuInfo.value.age);


</script>
<script>
export default {
    meta: {
        title: 'xyzl',
        name: '学员资料',
        routeName: "stuProfile",
        icon: "#icon-shangpinguanli"
    }
}
</script>
<style scoped>
.el-descriptions {
    margin-top: 20px;
}
.avatar{
    display: flex;
    justify-content: center;
}
</style>
  
